<template>
	<!-- 文章详情 -->
	<view class="newsdetaile">
		<image class="news_pic" v-if="news_info.image_url && !loaderr" @error="loaderrfun" :src="photo_cdn+news_info.image_url" mode="widthFix"></image>
		<view class="news_bodys">
			<view class="news_titlemax">{{news_info.title}}</view>
			<view class="news_d_author flex ali-c">
				<image v-if="news_info.photo" class="author_tximg" :src="photo_cdn+news_info.photo" mode=""></image>
				<view class="d_author_info">
					<view v-if="news_info.name" class="d_author_name">{{news_info.name}}</view>
					<view v-if="news_info.upload_name" class="d_author_name">{{news_info.upload_name}}</view>
					<view class="d_author_time">发布于 {{news_info.createtime}}</view>
				</view>
				
				<!-- ca_status：状态:0=取消收藏,1=已收藏 -->
				<view class="collect_btn_view">
					<view  class="collect_btn" @tap="reportfun">举报</view>
				</view>
				
			</view>
		</view>
		
		<view class="news_contents">
			<!-- <rich-text :nodes="democountent"></rich-text> -->
			<jyf-parser :html="news_info.content" :domain="false" ref="article" selectable show-with-animation use-anchor
				@error="error" @imgtap="imgtap" @linkpress="linkpress" @parse="parse" @ready="ready">加载中...
			</jyf-parser>
			
			<view class="pics_arr_tag">
				<image @tap="getviewimg(index)" class="pics_arr_img" v-for="(item,index) in pics_arr" :key="index" :src="photo_cdn+item" mode="widthFix"></image>
			</view>
		</view>
		
		
		
		<login :hidden="isshowlogin" @close="closefun" @loginsucc="loginsucc"></login>
	</view>
</template>

<script>
	
	import parser from '@/components/jyf-parser/jyf-parser'; // HBuilderX 2.5.5 及以上可以不需要
	import {getPhotoDetail} from "@/utils/api/zupu.js";
	import {getUserinfo} from "@/utils/api/api.js";
	import config from "@/utils/config.js";
	let {uploadFile,photo_cdn} = config.baseUrl;
	
	export default {
		components:{
			'jyf-parser': parser,
		},
		data() {
			return {
				photo_cdn,
				photo_wall_id:"",//文章id
				news_info:{},
				loaderr:false,//缩略图是否加载失败
				page:0,
				isshowall:false,
				latitude:"",
				longitude:"",
				isshowlogin: false,
				
				user_id: 0,
				userinfo:{},
				commentData: {
					comment:[],
					commentSize:0,
					readNumer:0										
				},
				reqFlag: false ,// 请求标志，防止重复操作，true表示请求中
				pics_arr:[],//图片列表
				
			}
		},
		onLoad(options) {
			this.photo_wall_id = options.photo_wall_id?options.photo_wall_id:"";
			this.newsdetailefun();	
		},
		onShow(){
			let token = uni.getStorageSync("token")
			if (!token) {
				// #ifdef MP-WEIXIN
				setTimeout(() => {
					this.isshowlogin = true;
				}, 1500)
				// #endif
			} else {
				this.getUserinfofun();
			}
		},
		onReachBottom() {
			if(!this.isshowall){
				
			}else{
				// this.$api.msg('没有更多了~');
			}
		},
		methods: {
			//举报
			reportfun(){
				uni.navigateTo({
					url:`/pagesim/center/report?title=反馈&contents=我要举全家福id为 ${this.photo_wall_id}  标题为 "${this.news_info.title}" 存在内容争议`
				})
			},
			
			async getUserinfofun() {
				let res = await getUserinfo({
			
				})
				this.userinfo = res.data.userinfo;
				this.user_id = res.data.userinfo.id;
			},
			// 登录校验
			async checkLogin() {
				let token = uni.getStorageSync("token");
				if(token){
					return true;
				}
				if (!token) {
					this.isshowlogin = true;
					return false;
				}
			},
			//关闭授权登录弹窗
			closefun() {
				this.isshowlogin = false;
			},
			//登录完成
			loginsucc() {
			
			},
			//缩略图加载失败
			loaderrfun(err){
				this.loaderr = true;
			},
			//解析完成时触发
			parse(res) {
			},
			//渲染完成时触发	
			ready(res) {
			},
			//图片被点击时触发	
			imgtap(res) {
				console.info(res,"图片点击");
			},
			//链接被点击时触发	
			linkpress(res) {
				// #ifdef APP-PLUS
				if (res.href && res.href.includes('http')) {
					res.ignore();
				}
				// #endif
			},
			//出错时触发	
			error(res) {
			
			},
			//获取照片墙详情
			async newsdetailefun(){
				let res = await getPhotoDetail({
					photo_wall_id:this.photo_wall_id,
				})
				if(res.code==1){
					this.news_info = res.data.info;
					this.pics_arr = res.data.info.pics.split(",");
				}
			},
			//预览图片
			getviewimg(index){
				let lists = this.pics_arr.map((item,index)=>{
					return this.photo_cdn + item;
				})
				uni.previewImage({
					urls:lists,
					current:index,
				})
			}
		}
	}
</script>

<style lang="scss">
	@import "./qjfinfo.scss";
</style>
